<template>
	<view class="tabbars">
		<view class="one" :class="[current==index?'active' : '']" v-for="(item,index) in data_pages" :key="index"
			@click="indexs(item,index)">
			{{
						item.text
					}}
		</view>

	</view>
</template>

<script>
	export default {
		props: ["current"],
		data() {
			return {
				data_pages: [{
						text: "首页",
						page: "/pages/index/index"
					},
					{
						text: "订单",
						page: "/pages/classify/classify"
					},
					{
						text: "订单页",
						page: "/pages/orders/orders"
					},
					{
						text: "我的",
						page: "/pages/mys/mys"
					}
				],
				items: ''
			}
		},
		onLoad() {


		},
		onShow() {
			console.log("11123")
		},
		methods: {
			indexs(item, index) {
				console.log(this.current,index);
				this.items = item
				uni.navigateTo({
					url: `${this.data_pages[index].page}`
				})
			},

		}
	}
</script>

<style lang="scss">
	*{
		font-size: 5vw;
		text-align: center;
		line-height: 18vw;
		font-family: Microsoft JhengHei;
	}

	.tabbars {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 18vw;
		background-color: aquamarine;
		overflow-y: scroll;
		display: flex;
		flex-wrap: wrap;
		display: -webkit-flex;
		-webkit-overflow-scrolling:touch;
		/* Safari */
		.one {
			width: 25%;
			height: 100%;


		}

		.active {
			background: #1AA034;
			color: #fff;
		}
	}
</style>